<template>
    <up-input v-model="password" :password="!showPassword"
        placeholder="请输入密码" border="none" @change="handlerChange"
    >
        <template #suffix>
            <view @click="()=>showPassword=!showPassword">
                <up-icon v-if="!showPassword" name="eye-fill"></up-icon>
                <up-icon v-else name="eye-off"></up-icon>
            </view>
        </template>
    </up-input>
</template>

<script setup lang="ts">
    import { ref,reactive } from 'vue';
    import {props as inputProps} from "uview-plus/components/u-input/props";

    const props=defineProps({
        ...inputProps
    })
    const emit=defineEmits(['update:modelValue', 'focus', 'blur', 'change', 'confirm', 'clear', 'keyboardheightchange'])

    const showPassword=ref(false)

    const password=ref(props.modelValue)

    const handlerChange=(e)=>{
        emit("update:modelValue", e);
    }

</script>

<style lang="scss" scoped>

</style>